<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>用户列表</title>

    <link href="/css/bootstrap.min.css" rel="stylesheet">
    <script src="/js/jquery-2.1.0.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <style type="text/css">
        td, th {
            text-align: center;
        }
    </style>
</head>
<body>
<div class="container">
    <h3 style="text-align: center">用户列表</h3>
    <table border="1" class="table table-bordered table-hover">
        <thead>
        <tr style="background-color:rgb(51, 122, 183);">
            <th style="color:white">ID</th>
            <th style="color:white">用户名</th>
            <th style="color:white">年龄</th>
            <th style="color:white">性别</th>
            <th style="color:white">时间</th>
            <th style="color:white">操作</th>
        </tr>
        </thead>
        <tbody id="content">

        </tbody>
        <tr>
            <td colspan="8" align="center">
                <a class="btn btn-success" href="/add.jsp"><i class="glyphicon glyphicon-plus"></i>新增用户</a>
                <a class="btn btn-danger" href="/user/logout"><i class="glyphicon glyphicon-flash"></i>注销</a>
            </td>
        </tr>




    </table>
    <script>
        $(function () {

            $.get("/user/findAll", function (data) {
                var trs = "";
                for (var user of data) {
                    trs += "<tr>\n" +
                        "            <td>" + user.id + "</td>\n" +
                        "            <td>" + user.username + "</td>\n" +
                        "            <td>" + user.password + "</td>\n" +
                        "            <td>" + user.birthday + "</td>\n" +
                        "            <td>" + user.address + "</td>\n" +
                        "            <td>\n" +
                        "                <a class=\"btn btn-info btn-sm\" href=\"/user/updateView?id=" + user.id + "\"><i class=\"glyphicon glyphicon-pencil\"></i>修改</a>\n" +
                        "                <a class=\"btn btn-danger btn-sm\" href=\"/user/delete?id=" + user.id + "\"><i class=\"glyphicon glyphicon-remove\"></i>删除</a>\n" +
                        "            </td>\n" +
                        "        </tr>";
                }

                $("#content").html(trs);

            });


        })
    </script>
</div>
</body>
</html>